<img src="https://any.moest.top/monkeydoc/res/ayavideorecorder/ayavrec_ico.png" />
<h1>文文錄影机</h1>
<br>
<hr />
<br>
<h2>主要功能</h2>
<ol>
    <li>錄製网页上原始分辨率的视频</li>
    <li>支持大部分在線视频、直播的任意時間錄製和停止</li>
    <li>可切換多種浏览器支持的视频編碼类型</li>
    <li>不同网站分别設置錄影按鈕的显示方式</li>
    <li>錄影時发生暂停或缓冲時自动暂停錄影，播放时自动继续錄影</li>
</ol>
<br>
<h2>條件限制</h2>
<ul>
    <li>錄影時<strong>不可以完全静音</strong>，或将音量調为 0 ，如果这么做将导致錄影暂停</li>
    <li>由于浏览器安全性规则，<strong>不可以对跨域视频錄影</strong>，如网站域名为 a.com 而視頻在 b.com 域名中，如果这么做将尝试并提供打开視頻源的代替方案</li>
    <li>由于 W3C 規则，<strong>不可以对加密視頻錄影</strong>，如EME加密規則类型的視頻，如果这么做将受到浏览器的阻止并发生错误</li>
</ul>
<br>
<h2>兼容性</h2>
<p>最新版本的 Chrome、Firefox 浏览器都兼容这个腳本</p>
<br>
<table border="1" cellspacing="0" cellpadding="12" style="text-align:center">
    <thead>
        <tr>
            <th>API</th>
            <th>Chrome</th>
            <th>Firefox</th>
            <th>參考鏈接</th>
            <th>必要性</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>MediaRecorder</td>
            <td>Version >= 49</td>
            <td>Version >= 29</td>
            <td><a href="https://caniuse.com/mediarecorder" target="_blank">Can i use?</a></td>
            <td>√</td>
        </tr>
        <tr>
            <td>CSS Backdrop Filter</td>
            <td>Version >= 76</td>
            <td>Version >= 70 *</td>
            <td><a href="https://caniuse.com/css-backdrop-filter" target="_blank">Can i use?</a></td>
            <td>×</td>
        </tr>
    </tbody>
</table>
<br>
<p>你可以查看浏览器关于中的版本，參考腳本的兼容性</p>
<br>
<p>如果你使用 Firefox 浏览器，为了更好的体验請在实验性功能中啟用“backdrop-filter”选項，如下图示例</p>
<img src="https://any.moest.top/monkeydoc/res/ayavideorecorder/firefox_config_backdrop_filter.jpg" />
<br>
<br>
<h2>使用說明</h2>
<h3>錄影</h3>
<p>一般只需要将鼠標光標移動到視頻上，就会在視頻左上角出现「錄影」按鈕</p>
<p>点击「錄影」按鈕后，按照弹出的提示框选择开始錄影即可</p>
<p>平均每 5 秒約需要 2.3 MB 左右，根据視頻編碼类型有所差异，长時間錄像建议可用内存在 4 GB 以上</p>
<img src="https://any.moest.top/monkeydoc/res/ayavideorecorder/ayavr_record.jpg" />
<br><br>
<h3>停止并下載錄影</h3>
<p>在錄影過程中可以隨時按「停止」按鈕停止錄影</p>
<p>一旦停止錄影按鈕会立刻変为「下载錄影」按鈕，会一直存在，你可以隨時下載錄影，或者取消下載并重新开始錄影</p>
<img src="https://any.moest.top/monkeydoc/res/ayavideorecorder/ayavr_recording.jpg" />
<br>
<img src="https://any.moest.top/monkeydoc/res/ayavideorecorder/ayavr_dl.jpg" />
<br><br>
<h3>改変錄影按鈕显示方式</h3>
<p>通常情况下，錄影按鈕会与視頻在同一层上，但有時候在視頻上一层会有其它可能看不见的遮罩层，这会影响錄影按鈕的操作</p>
<p>如果发生了这种情况，就不得不考虑它出现了的事实，這時候可以通過腳本的設置改変按鈕显示的方式和层次来解决这个问題</p>
<img src="https://any.moest.top/monkeydoc/res/ayavideorecorder/ayavr_config.jpg" />
<br>
<img src="https://any.moest.top/monkeydoc/res/ayavideorecorder/ayavr_config_btns.jpg" />
<br><br>
<h3>改変錄影的視頻編碼类型</h3>
<p>在腳本設置中可以改変錄影視頻的編碼类型，視頻編碼类型会根据浏览器已支持的类型给出可以选择的选項，不支持的类型将不会出現</p>
<p>所有編碼类型最终都会保存为 webm 格式，因为这只会影响編碼方式，并不会改変視頻的格式</p>
<img src="https://any.moest.top/monkeydoc/res/ayavideorecorder/ayavr_config_mimetype.jpg" />
<br><br>
<h2>常見问題</h2>
<h3>錄影按鈕不显示</h3>
<p>因为腳本会在页面加載完成的 5 秒内尝試查找网页上的視頻，如果超过 5 秒找不到視頻，腳本就会停止查找</p>
<p>而有些网页的視頻在播放之前只会显示一张預览图，只有点击播放的时候才会出现視頻</p>
<p>还有的時候是因为在腳本設置中选错了按鈕显示的层次，导致按鈕出現在和視頻有一段距离的外面</p>
<p>如果发生了这种情况，就不得不考虑它出现了的事实，這時候可以通過腳本的設置改変按鈕显示的方式和层次来解决这个问題</p>
<img src="https://any.moest.top/monkeydoc/res/ayavideorecorder/ayavr_out.jpg" title="錄像按鈕显示在視頻外" />
<br>
<h3>錄影暂停</h3>
<p>一般暂停的原因有这几种情况：</p>
<ul>
    <li>視頻正在缓冲</li>
    <li>視頻被暂停</li>
    <li>視頻音量被調为 0 或設置为 静音</li>
</ul>
<br>
<h3>錄影時視頻卡頓</h3>
<p>因为錄影是将視頻軌和音頻軌分开錄製再合并流进行处理，一些网页視頻可能因視頻軌和音頻軌有碼率差异而造成錄影性能影响</p>
<p>如果发生了这种情况，就不得不考虑它出现了的事实，建议使用其它方法錄製這种視頻</p>